<aside class="l_box">
    <div class="search">
        <form method="post" id="searchform">
            <input name="title" class="input_text" placeholder="请输入关键字词" type="text" autocomplete="off" list="titles">
            <datalist id="titles">
                <option>Java</option>
                <option>SpringBoot</option>
                <option>SpringCloud</option>
                <option>搜索引擎</option>
            </datalist>
            <input class="input_submit" value="搜索" type="button" onclick="dosearch()">
        </form>
    </div>
    <div class="fenlei">
        <h2>文章分类</h2>
        <ul>
            <li><a href="#">Springboot（<span id="count1">0</span>）</a></li>
            <li><a href="#">搜索引擎（<span id="count2">0</span>）</a></li>
            <li><a href="#">Java（<span id="count3">0</span>）</a></li>
            <li><a href="#">Redis（<span id="count4">0</span>）</a></li>
        </ul>
    </div>
    <div class="tuijian">
        <h2>站长推荐</h2>
        <ul>
            <li v-for="ls in lists"><a v-bind:href="ls.content" target="_blank">{{ls.title}}</a></li>
        </ul>
    </div>
    <div class="tuijian">
        <h2>点击排行</h2>
        <ul>
            <li v-for="ls in lists"><a v-bind:href="ls.content" target="_blank">{{ls.title}}</a></li>
        </ul>
    </div>
    <div class="cloud">
        <h2>标签云</h2>
        <ul>
            <a href="#">SpringBoot</a>
            <a href="#">Mybatis</a>
            <a href="#">Redis</a>
            <a href="#">Websocket</a>
            <a href="#">Shiro</a>
            <a href="#">多数据源</a>
            <a href="#">MongoDB</a>
            <a href="#">Quartz</a>
            <a href="#">Dubbo</a>
            <a href="#">ElasticSearch</a>
            <a href="#">SpringCloud</a>
            <a href="#">RabbitMQ</a>
        </ul>
    </div>
    <div class="guanzhu">
        <h2>关注我 么么哒</h2>
        <ul>
            <img src="images/wx.jpg">
        </ul>
    </div>
</aside>
<script>
    var _vue = new Vue({
        el: '.l_box ',
        data: {
            lists: [],
        },
        created: function () {
            this.getList();
        },
        methods: {
            getList: function () {
                $.ajax({
                    url: 'blog/get/all',
                    dataType: 'json',
                    type: 'get',
                    success: function (data) {
                        _vue.lists = data;
                    }
                });
            }
        }
    });
</script>